
<template>
  <basic-container>
    <el-select v-model="params.dates" placeholder="请选择" @change="changeDate" style="width: 250px" clearable filterable>
      <el-option
        v-for="(item,index) in dateList"
        :key="index"
        :label="item.logTime"
        :value="item.logTime">
      </el-option>
    </el-select>
    <avue-crud
      ref="crud"
      :page="page"
      :data="tableData1"
      :table-loading="tableLoading"
      :option="tableOption"
      @on-load="getList"
    >
      <template
        slot="errMsg"
        slot-scope="scope"
      >
        <span style="color: red">{{scope.row.errMsg}}</span>
      </template>
    </avue-crud>
    <div style="text-align: center; margin: 40px">
      <el-button @click="$emit('close')">返 回</el-button>
    </div>
  </basic-container>
</template>

<script>
import { mapGetters } from "vuex";
import { previewTableOption } from '@/const/crud/rca/viewswckstationdailyreportadjustquery'
import { getQuerySwCkStationDailyReportAdjustRecordLog,getTradeDateList } from '@/api/rca/swckstationdailyreportadjustquery'

export default {
  name: "viewswckstationdailyreportadjustquery",
  props: ["target"],
  data(){
    return{
      dateList: [],
      params: {
        dates: ''
      },
      tableData1: [],
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 20, // 每页显示多少条
      },
      tableOption: previewTableOption,
      tableLoading: false
    }
  },
  computed: {
    ...mapGetters(["permissions"]),
    permissionList () {
      return {
      };
    },
  },
  methods: {
    async getTradeDate() {
      const tradeDate  = this.target.tradeDate;
      const lineCode  = this.target.lineCode;
      await getTradeDateList({
        tradeDate: tradeDate,
        lineCode: lineCode
      })
      .then((res) => {
        this.dateList = res.data.data;
        if(this.dateList.length>0){
          this.params.dates = this.dateList[0].logTime;
        }
      })
    },
    changeDate(){
      this.getList(this.page);
    },
    getList (page, query) {
      if(this.validatenull(this.params.dates)){
        this.getTradeDate().then((res) => {
          this.tableLoading = true;
          const lineCode  = this.target.lineCode;
          const tradeDate  = this.target.tradeDate;
          getQuerySwCkStationDailyReportAdjustRecordLog({
            tradeDate: tradeDate,
            logTime: this.params.dates,
            lineCode: lineCode
          })
            .then((response) => {
              this.tableData1 = response.data.data.map(item=>({
              ...item,
              lineCode: item.lineCode.replace(/^0./, "")
            }))
              this.tableLoading = false;
            })
            .catch(() => {
              this.tableLoading = false;
            }); 
        })
      }else{
        this.tableLoading = true;
        const tradeDate  = this.target.tradeDate;
        const lineCode  = this.target.lineCode;
        getQuerySwCkStationDailyReportAdjustRecordLog({
          tradeDate: tradeDate,
          logTime: this.params.dates,
          lineCode: lineCode
        })
          .then((response) => {
            this.tableData1 = response.data.data.map(item=>({
            ...item,
            lineCode: item.lineCode.replace(/^0./, "")
          }))
            this.tableLoading = false;
          })
          .catch(() => {
            this.tableLoading = false;
          }); 
      }
    },
  }
};
</script>
<style scoped lang="scss">
.table-opt {
  margin-left: 0;
  margin-right: 20px;
  margin-bottom: 20px;
}
.title {
  line-height: 30px;
  border-left: 2px solid blue;
  padding: 0 20px;
  margin-bottom: 30px;
}
</style>
